/* eslint-disable no-unused-vars */
import React, { PureComponent, Fragment } from 'react';
import moment from 'moment';
import router from 'umi/router';
import { connect } from 'dva';
import { DownOutlined, UpOutlined, QuestionCircleOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import {
  Alert,
  Card,
  Button,
  Modal,
  Input,
  Tooltip,
  Select,
  Row,
  Col,
  message,
  DatePicker,
  Menu,
  Dropdown,
  Tabs,
  Divider,
  Spin,
  Progress,
} from 'antd';
import _ from 'lodash';
import queryString from 'query-string';
import downloadFile, { matchDict, cusSome, getProPagination } from '@/utils/utils';
import StandardTable from '@/components/StandardTable';
import styles from '@/utils/utils.less';
import PageHeaderWrapper from '@/components/PageHeaderWrapper'; // 引入头部组件
import Authorized from '@/utils/Authorized';
import { checkPermissions } from '@/utils/authority';
import ProTable from '@/pages/components/Problem/ProblemPage/ProTable';
import ProModal from '@/pages/components/Problem/ProblemPage/ProModal';
import ProExportBtn from '@/pages/components/Problem/ProblemPage/ProExportBtn';
import SearchAccoListOs from '../../components/SearchAccoListOs';
import Customer from '../../components/Customer';
import DeclareModal from '../../components/DeclareModal';
import SearchPersonEs from '../../components/SearchPersonEs';
import BigwareList from '../Bigwarelist';
import BatchTaskProgress from '../../components/BatchTaskProgress';
import TextOverFlow from '../../components/TextOverFlow';

const FormItem = Form.Item;
const { RangePicker } = DatePicker;
const { Option } = Select;
const { TextArea } = Input;
const { TabPane } = Tabs;
const { confirm } = Modal;

@connect(({ addempsocial,bigaccomanage, loading, login, addsocialbatch }) => ({
  addempsocial,
  bigwareList: bigaccomanage.bigwareList,
  listLoading: loading.effects['bigaccomanage/fetchInsSearchList'],
  activeKey: addempsocial.activeKey,
  formFieldsValue: addempsocial.formFieldsValue,
  formatFormFieldsValue: addempsocial.formatFormFieldsValue,
  expandForm: addempsocial.expandForm,
  pageData: addempsocial.pageData,
  loading: loading.effects['addempsocial/getSocialAdd'],
  proPageData: addempsocial.proPageData,
  defaultLibrary: addempsocial.defaultLibrary,
  valuesArr: addempsocial.valuesArr,
  tag: addempsocial.tag,
  login,
  proFormFieldsValue: addempsocial.proFormFieldsValue,
  addsocialbatch,
}))
@Form.create()
class BasicList extends PureComponent {
  state = {
    rowSelection: [], // 列表选中的ID集合
    visible2: false,
    proVisible: false,
    signValue: '1',
    decExcelVisible: false,
    mode: ['month', 'month'],
    selectedRows: [],
    selectedKeys: [],
    accoOwnerFlag: false,
    insAccoNameDefault:""
    // confirmLoading: false,
    // excelLoading: false,
  };

  componentDidMount() {
    const {
      dispatch,
      location,
      login: { baseUser },
    } = this.props;
    
    dispatch({
      type: 'addempsocial/getParam',
      payload: {},
    }).then(res => {
      if (!res.data) {
        Modal.warning({
          title: '重要提示',
          content: '请联系公司管理员配置参数设置',
          okText: '确定',
          onOk() {
            dispatch({
              type: 'login/logout',
            });
          },
        });
        return;
      }
      // 查询是否都设置了默认大库
      dispatch({
        type: 'addempsocial/getDefaultLibrary',
        payload: {},
      });
      const { insAccoName } = location.query;
      this.setState({
        insAccoNameDefault:insAccoName
      })
      this.getInitialList();
    });
    this.setState({ accoOwnerFlag: baseUser.postType === 2 });
  }

  componentWillUnmount() {
    const { interval } = this.state;
    clearInterval(interval);
  }

  searchBtnList = activeKey => {
    const { form, valuesArr, dispatch } = this.props;
    form.validateFieldsAndScroll(
      [...valuesArr, 'declWay', 'curMthDeclFlag', 'accoRespId','insAccoId'],
      (err, values) => {
        if (!err) {
          dispatch({
            type: 'addempsocial/updateModalData',
            payload: {
              activeKey,
              formFieldsValue: values,
            },
          });
          this.searchList(this.processFormData(values), activeKey);
        }
      }
    );
  };

  searchList = (
    formFieldsValue,
    activeKey = '1',
    currentPage = 1,
    pageSize = 10,
    isClear = true
  ) => {
    const { dispatch } = this.props;
    const { insAccoNameDefault} = this.state
    if (isClear) {
      this.setState({
        selectedKeys: [],
        selectedRows: [],
        rowSelection: [],
      });
    }
    if (activeKey && Number(activeKey) === 5) {
      setTimeout(() => {
        const { proTable } = this.state;
        const proFormFieldsValue = { ...formFieldsValue, busiType: 14 };
        dispatch({
          type: 'addempsocial/updateModalData',
          payload: {
            proFormFieldsValue,
          },
        });
        if (proTable.searchList) {
          proTable.searchList(proFormFieldsValue, currentPage, pageSize);
        }
      });
    } else {
      console.log(formFieldsValue,'formFieldsValueformFieldsValue');
      const copyAll = {
        insAccoName:insAccoNameDefault,
        currentPage,
        pageSizes: pageSize,
        execStep: Number(activeKey),
        ...formFieldsValue,
        curMthDeclFlag: Number(activeKey) === 1 ? formFieldsValue.curMthDeclFlag : undefined,
        declWay: Number(activeKey) === 2 ? formFieldsValue.declWay : undefined,
      };
      dispatch({
        type: 'addempsocial/updateModalData',
        payload: {
          copyAll,
        },
      });
      dispatch({
        type: 'addempsocial/getSocialAdd',
        payload: copyAll,
      });
    }
  };

  getInitialList = () => {
    const {
      pageData: { pagination },
      dispatch,
      location,
      activeKey,
      formFieldsValue,
    } = this.props;
    const tempActiveKey = queryString.parse(location.search).activeKey || activeKey;
    if (location.queryParam) {
      dispatch({
        type: 'addempsocial/updateModalData',
        payload: { formFieldsValue: location.queryParam, expandForm: true },
      });
    }
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        activeKey: tempActiveKey,
      },
    });
    const proPagination = getProPagination(tempActiveKey, '5', pagination);
    dispatch({
      type: 'addempsocial/getDictList',
      payload: {},
    }).then(res => {
      if (res.success) {
        this.searchList(
          this.processFormData({ curMthDeclFlag: '1', ...formFieldsValue }),
          tempActiveKey,
          proPagination.current,
          proPagination.pageSize
        );
      }
    });
  };

  reset = () => {
    const { form, dispatch } = this.props;
    form.resetFields();
    form.setFieldsValue({ operTime: null, timeDate: null });
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        formFieldsValue: {},
      },
    });
  };

  textChangeR = e => {
    this.setState({
      textR: e.target.value,
    });
  };

  editMark = record => {
    this.setState({
      remarkVisible: true,
      busiId: record.addDetId,
      sendId: record.sendId,
      textR: '',
      taskId: record.taskId,
    });
  };

  remarkOk = () => {
    const {
      activeKey,
      dispatch,
      pageData: { pagination },
      formFieldsValue,
    } = this.props;
    const { busiId, textR, sendId, taskId } = this.state;
    const obj = {};
    obj.busiId = busiId;
    obj.content = textR;
    obj.sendId = sendId;
    obj.taskId = taskId;
    // 执行结果
    dispatch({
      type: 'addempsocial/remarkOk',
      payload: obj,
    }).then(res => {
      if (res.success) {
        this.setState({
          remarkVisible: false,
        });
        this.searchList(
          this.processFormData(formFieldsValue),
          activeKey,
          pagination.current,
          pagination.pageSize
        );
      }
    });
  };

  remarkCancel = () => {
    this.setState({
      remarkVisible: false,
    });
  };

  // 下载
  download = (url, param) => {
    downloadFile(param, url, 'POST');
  };

  // 材料下载
  materialDownload = () => {
    const {
      pageData: { list },
      addempsocial: { copyAll },
    } = this.props;
    const { selectedKeys } = this.state;
    if (!selectedKeys || selectedKeys.length === 0) {
      // 如果不选择数据，下载全部
      if (list.length > 0) {
        confirm({
          title: '是否对当前列表全部数据进行材料下载？',
          icon: <QuestionCircleOutlined />,
          okText: '是',
          cancelText: '否',
          onOk: () => {
            this.download('/osApi/insAddDet/downloadMatsZip', copyAll);
          },
          onCancel() {},
        });
      }
    } else {
      confirm({
        title: (
          <div>
            是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
            条数据进行材料下载？
          </div>
        ),
        icon: <QuestionCircleOutlined />,
        okText: '是',
        cancelText: '否',
        onOk: () => {
          const objAll = {
            addDetIds: selectedKeys,
            ...copyAll,
          };
          this.download('/osApi/insAddDet/downloadMatsZip', objAll);
        },
        onCancel() {},
      });
    }
  };

  getDeclList = (currentPage, pageSize) => {
    const {
      dispatch,
      addempsocial: { copyAll },
    } = this.props;
    const { selectedKeys, declWay } = this.state;
    this.setState({
      tableLoading: true,
    });
    dispatch({
      type: 'addempsocial/getDeclList',
      payload: {
        addDetIds: selectedKeys,
        ...copyAll,
        declWay,
        // pagerArg: {
        //   currentPage,
        //   pageSize,
        // },
      },
    }).then(() => {
      this.setState({
        decExcelVisible: true,
        tableLoading: false,
      });
    });
  };

  // 申报明细表导出
  declareExport = () => {
    const {
      activeKey,
      pageData: { list },
      dispatch,
      addempsocial: { copyAll },
    } = this.props;
    const { selectedKeys } = this.state;
    const declWay = Number(activeKey) === 2 ? 2 : undefined;
    if (list.length > 0) {
      dispatch({
        type: 'addempsocial/updateModalData',
        payload: {
          downParam: {
            addDetIds: selectedKeys,
            ...copyAll,
            declWay,
          },
        },
      });
      this.setState(
        {
          declWay,
        },
        () => {
          this.getDeclList(1, 5);
        }
      );
    } else {
      message.warning('无查询结果，不可导出！');
    }
  };

  goProgress = () => {
    router.push('/socialinsurancemanagement/insrecruition/progress');
  };

  // 批量修改
  batchModify = () => {
    router.push('/socialinsurancemanagement/insrecruition/batchModify');
  };

  onDeclareCancel = () => {
    this.setState({
      decExcelVisible: false,
    });
  };

  onDeclareOk = () => {
    const {
      addempsocial: { downParam },
    } = this.props;
    downloadFile(downParam, '/osApi/insAddDet/downloadDeclDetInsAddImport', 'POST');
    this.setState({
      decExcelVisible: false,
    });
  };

  // 手动申报 结果导入  弹框  确定
  handleOk2 = () => {
    this.setState({
      visible2: false,
    });
  };

  // 手动申报 材料下载  弹框  取消
  handleCancel2 = () => {
    this.setState({
      visible2: false,
    });
  };

  proHandleOk = () => {
    const {
      activeKey,
      pageData: { pagination },
      formFieldsValue,
    } = this.props;
    this.setState({
      proVisible: false,
    });
    this.searchList(
      this.processFormData(formFieldsValue),
      activeKey,
      pagination.current,
      pagination.pageSize
    );
  };

  // 手动申报 材料下载  弹框  取消
  handleCancel3 = () => {
    this.setState({
      proVisible: false,
    });
  };

  // 问题人员
  signProblem = () => {
    const { rowSelection } = this.state;
    if (!this.rowValidate()) {
      return;
    }
    if (cusSome(rowSelection, 'probFlag', 1)) {
      message.error('问题人员无法做相关操作');
    } else {
      this.setState({
        proVisible: true,
      });
    }
  };

  confirmInter = () => {
    const tempArr = [];
    const {
      activeKey,
      dispatch,
      pageData: { pagination },
      formFieldsValue,
    } = this.props;
    const { rowSelection } = this.state;
    rowSelection.map(value => {
      const tempJson = {};
      tempJson.addDetId = value.addDetId;
      tempJson.vno = value.vno;
      tempArr.push(tempJson);
      return true;
    });
    // dispatch({
    //   type: 'addempsocial/confirmInter',
    //   payload: {
    //     insAddDets: tempArr,
    //     execStep: activeKey,
    //   },
    // }).then(res => {
    //   if (res.success) {
    //     this.searchList(
    //       this.processFormData(formFieldsValue),
    //       activeKey,
    //       pagination.current,
    //       pagination.pageSize
    //     );
    //   }
    // });
    // 改为异步socket
    dispatch({
      type: 'addsocialbatch/uploadFileWithProgress',
      payload: {
        params: {
          insAddDets: tempArr,
          execStep: activeKey,
        },
        type: '2',
      },
    });
  };

  handleChange = value => {
    this.setState({
      signValue: value,
    });
  };

  handleOk5 = () => {
    this.setState({
      visible5: false,
    });
  };

  downSingleClick = values => {
    const {
      addempsocial: { downParam },
    } = this.props;
    const { insDeclExportId } = values;
    downloadFile(
      {
        ...downParam,
        insDeclExportId,
      },
      '/osApi/insAddDet/insAddDeclDetSingleExport',
      'POST'
    );
  };

  handleCancel5 = () => {
    this.setState({
      visible5: false,
    });
  };

  pageChange = (current, pageSizes) => {
    this.getDeclList(current, pageSizes);
  };

  pageSizeChange = (current, pageSizes) => {
    this.getDeclList(current, pageSizes);
  };

  signSuccess = () => {
    const {
      activeKey,
      dispatch,
      pageData: { pagination },
      formFieldsValue,
    } = this.props;
    const { rowSelection, selectedKeys } = this.state;
    if (!this.rowValidate()) {
      return;
    }
    if (cusSome(rowSelection, 'probFlag', 1)) {
      message.error('问题人员无法做相关操作');
    } else {
      const confirmReference = confirm({
        title: (
          <div>
            是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
            条数据标记申报成功？
          </div>
        ),
        icon: <QuestionCircleOutlined />,
        okText: '是',
        cancelText: '否',
        onOk: () => {
          confirmReference.update({
            okButtonProps: { loading: true },
          });
          const tempArr = [];
          rowSelection.map(value => {
            const tempJson = {};
            tempJson.addDetId = value.addDetId;
            tempJson.vno = value.vno;
            tempArr.push(tempJson);
            return true;
          });
          // return new Promise(resolve => {
          //   dispatch({
          //     type: 'addempsocial/signSuccess',
          //     payload: {
          //       insAddDets: tempArr,
          //     },
          //   }).then(res => {
          //     if (res.success) {
          //       this.searchList(
          //         this.processFormData(formFieldsValue),
          //         activeKey,
          //         pagination.current,
          //         pagination.pageSize
          //       );
          //     }
          //     resolve();
          //   });
          // });

          // 走socket异步
          dispatch({
            type: 'addsocialbatch/uploadFileWithProgress',
            payload: {
              params: {
                insAddDets: tempArr,
              },
              type: '1',
            },
          });
        },
        onCancel() {},
      });
    }
  };

  // 进度弹框显隐
  handleProgressModalVisible = flag => {
    const {
      activeKey,
      pageData: { pagination },
      formFieldsValue,
      dispatch,
    } = this.props;
    if (!flag) {
      dispatch({
        type: 'addsocialbatch/updateModelData',
        payload: {
          showProgress: false,
        },
      });
      this.searchList(
        this.processFormData(formFieldsValue),
        activeKey,
        pagination.current,
        pagination.pageSize
      );
    }
  };

  // 标记失败
  signFail = () => {
    const {
      activeKey,
      dispatch,
      pageData: { pagination },
      formFieldsValue,
    } = this.props;
    const { rowSelection, selectedKeys } = this.state;
    if (!this.rowValidate()) {
      return;
    }
    if (cusSome(rowSelection, 'probFlag', 1)) {
      message.error('问题人员无法做相关操作');
    } else {
      confirm({
        title: (
          <div>
            是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
            条数据标记申报失败？
          </div>
        ),
        icon: <QuestionCircleOutlined />,
        okText: '是',
        cancelText: '否',
        onOk: () => {
          const arr = [];
          rowSelection.map(value => {
            const tempJson = {};
            tempJson.addDetId = value.addDetId;
            tempJson.vno = value.vno;
            arr.push(tempJson);
            return true;
          });
          dispatch({
            type: 'addempsocial/signFail',
            payload: {
              insAddDets: arr,
            },
          }).then(temp => {
            if (temp.success) {
              this.searchList(
                this.processFormData(formFieldsValue),
                activeKey,
                pagination.current,
                pagination.pageSize
              );
            }
          });
        },
        onCancel() {},
      });
    }
  };

  dateChange = value => {
    const { form } = this.props;
    form.setFieldsValue({
      timeDate: value,
    });
  };

  rowValidate = () => {
    const { rowSelection } = this.state;
    if (!rowSelection || rowSelection.length === 0) {
      message.warning('请至少选择一项！');
      return false;
    }
    return true;
  };

  // 网上申报按钮
  onDeclare = () => {
    const {
      pageData: { list },
      activeKey,
      defaultLibrary,
      dispatch,
      addempsocial: { copyAll },
    } = this.props;
    const { selectedKeys, rowSelection } = this.state;
    if (Number(activeKey) === 1 && defaultLibrary) {
      message.error('业务范围维护的地区增加了政策组，请先维护该地区的政策组默认大库后再申报。');
    } else if (!selectedKeys || selectedKeys.length === 0) {
      if (list.length > 0) {
        confirm({
          title: <div>是否对当前列表全部数据进行网上申报？</div>,
          okText: '是',
          cancelText: '否',
          icon: <QuestionCircleOutlined />,
          onOk: () => {
            dispatch({
              type: 'addempsocial/onDeclare',
              payload: copyAll,
            }).then(() => {
              this.setState({
                selectedKeys: [],
                selectedRows: [],
                rowSelection: [],
              });
            });
          },
          onCancel() {},
        });
      }
    } else {
      const statusArr = [];
      rowSelection.map(value => {
        statusArr.push(Number(value.payWay));
        return true;
      });
      if (cusSome(rowSelection, 'probFlag', 1)) {
        message.error('问题人员无法做相关操作');
      } else if (statusArr.indexOf(1) < 0) {
        this.bigApply(); // 大库
      } else if (statusArr.indexOf(2) < 0) {
        this.singleApply(); // 单立户
      } else {
        this.bigApply(); // 大库
      }
    }
  };

  // 线下申报按钮
  offDeclare = () => {
    const {
      activeKey,
      pageData: { list },
      defaultLibrary,
      dispatch,
      addempsocial: { copyAll },
    } = this.props;
    const { selectedKeys, rowSelection } = this.state;
    if (Number(activeKey) === 1 && defaultLibrary) {
      message.error('业务范围维护的地区增加了政策组，请先维护该地区的政策组默认大库后再申报。');
    } else if (!selectedKeys || selectedKeys.length === 0) {
      if (list.length > 0) {
        confirm({
          title: '是否对当前列表全部数据进行线下申报？',
          okText: '是',
          cancelText: '否',
          icon: <QuestionCircleOutlined />,
          onOk: () => {
            dispatch({
              type: 'addempsocial/offDeclare',
              payload: copyAll,
            });
            this.setState({
              selectedKeys: [],
              selectedRows: [],
              rowSelection: [],
            });
          },
          onCancel() {},
        });
      }
    } else {
      const statusArr = [];
      rowSelection.map(value => {
        statusArr.push(Number(value.payWay));
        return true;
      });
      if (cusSome(rowSelection, 'probFlag', 1)) {
        message.error('问题人员无法做相关操作');
      } else if (statusArr.indexOf(1) < 0) {
        this.offBigApply(); // 大库
      } else if (statusArr.indexOf(2) < 0) {
        this.offSingleApply(); // 单立户
      } else {
        this.offBigApply(); // 大库
      }
    }
  };

  // 去设置五险合一
  goConfig = () => {
    router.push('/system/systemmanagement');
  };

  // 大库网上申报接口
  bigApply = () => {
    const { dispatch } = this.props;
    const tempArr = [];
    const { rowSelection, selectedKeys } = this.state;
    rowSelection.map(value => {
      tempArr.push(value.addDetId);
      return true;
    });
    const arr = [];
    rowSelection.forEach(item => {
      const obj = {};
      obj.addDetId = item.addDetId;
      obj.vno = item.vno;
      arr.push(obj);
    });
    confirm({
      title: (
        <div>
          是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
          条数据进行网上申报
        </div>
      ),
      okText: '是',
      icon: <QuestionCircleOutlined />,
      cancelText: '否',
      onOk: () => {
        dispatch({
          type: 'addempsocial/onDeclare',
          payload: { insAddDets: arr },
        });
        this.setState({
          selectedKeys: [],
          selectedRows: [],
          rowSelection: [],
        });
      },
      onCancel() {},
    });
  };

  offBigApply = () => {
    const { dispatch } = this.props;
    const tempArr = [];
    const { selectedKeys, rowSelection } = this.state;
    rowSelection.map(value => {
      tempArr.push(value.addDetId);
      return true;
    });
    const arr = [];
    rowSelection.forEach(item => {
      const obj = {};
      obj.addDetId = item.addDetId;
      obj.vno = item.vno;
      arr.push(obj);
    });
    confirm({
      title: (
        <div>
          是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
          条数据进行线下申报？
        </div>
      ),
      okText: '是',
      icon: <QuestionCircleOutlined />,
      cancelText: '否',
      onOk: () => {
        dispatch({
          type: 'addempsocial/offDeclare',
          payload: { insAddDets: arr },
        });
        this.setState({
          selectedKeys: [],
          selectedRows: [],
          rowSelection: [],
        });
      },
      onCancel() {},
    });
  };

  handleSelectRows = (selectedRows, selectedKeys) => {
    const newRows = _.cloneDeep(selectedRows);
    const newKeys = _.cloneDeep(selectedKeys);
    this.setState({ selectedRows: newRows, selectedKeys: newKeys, rowSelection: newRows });
  };

  handleStandardTableChange = pagination => {
    const {
      activeKey,
      formFieldsValue,
      formatFormFieldsValue: { curMthDeclFlag, declWay },
    } = this.props;

    this.searchList(
      this.processFormData({ ...formFieldsValue, curMthDeclFlag, declWay }),
      activeKey,
      pagination.current,
      pagination.pageSize,
      false
    );
  };

  // 单立户申报接口
  singleApply = () => {
    const { dispatch } = this.props;
    const { selectedKeys } = this.state;
    const tempArr = [];
    selectedKeys.map(value => {
      tempArr.push({
        addDetId: value.addDetId,
        vno: value.vno,
      });
      return true;
    });
    confirm({
      title: (
        <div>
          是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
          条数据进行网上申报？
        </div>
      ),
      icon: <QuestionCircleOutlined />,
      okText: '是',
      cancelText: '否',
      onCancel: () => {},
      onOk: () => {
        dispatch({
          type: 'addempsocial/onDeclare',
          payload: {
            insAddDets: tempArr,
          },
        });
        this.setState({
          selectedKeys: [],
          selectedRows: [],
          rowSelection: [],
        });
      },
    });
  };

  offSingleApply = () => {
    const { dispatch } = this.props;
    const { rowSelection } = this.state;
    const tempArr = [];
    rowSelection.map(value => {
      tempArr.push({
        addDetId: value.addDetId,
        vno: value.vno,
      });
      return true;
    });

    confirm({
      title: (
        <div>
          是否对当前列表<span className="emphasize-text">{rowSelection.length}</span>
          条数据进行线下申报？
        </div>
      ),
      icon: <QuestionCircleOutlined />,
      okText: '是',
      cancelText: '否',
      onCancel: () => {},
      onOk: () => {
        dispatch({
          type: 'addempsocial/offDeclare',
          payload: {
            insAddDets: tempArr,
          },
        });
        this.setState({
          selectedKeys: [],
          selectedRows: [],
          rowSelection: [],
        });
      },
    });
  };

  // 导出excel
  exportData = () => {
    const {
      pageData: { list },
      addempsocial: { copyAll },
      activeKey,
    } = this.props;
    const { selectedKeys } = this.state;
    if (!selectedKeys || selectedKeys.length === 0) {
      // 如果不选择数据，下载全部
      if (list.length > 0) {
        confirm({
          title: '是否对当前列表全部数据进行导出？',
          okText: '是',
          cancelText: '否',
          icon: <QuestionCircleOutlined />,
          onOk: () => {
            switch (activeKey) {
              case '1':
                this.download('/osApi/insAddDetExt/expInsAddToDecl', copyAll);
                break;
              case '2':
                this.download('/osApi/insAddDetExt/expInsAddToDecling', copyAll);
                break;
              case '3':
                this.download('/osApi/insAddDetExt/expInsAddToDecled', copyAll);
                break;
              default:
                break;
            }
          },
          onCancel() {},
        });
      }
    } else {
      confirm({
        title: (
          <div>
            是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
            条数据进行导出？
          </div>
        ),
        okText: '是',
        icon: <QuestionCircleOutlined />,
        cancelText: '否',
        onOk: () => {
          const objAll = {
            addDetIds: selectedKeys,
            ...copyAll,
          };
          switch (activeKey) {
            case '1':
              this.download('/osApi/insAddDetExt/expInsAddToDecl', objAll);
              break;
            case '2':
              this.download('/osApi/insAddDetExt/expInsAddToDecling', objAll);
              break;
            case '3':
              this.download('/osApi/insAddDetExt/expInsAddToDecled', objAll);
              break;
            default:
              break;
          }
         
        },
        onCancel() {},
      });
    }
  };

  // 处理form数据
  processFormData = fieldsValue => {
    const { dispatch } = this.props;
    const formFieldsValue = {};
    Object.keys(fieldsValue).forEach(key => {
      if (key === 'timeDate') {
        formFieldsValue.startDate =
          (fieldsValue.timeDate && fieldsValue.timeDate[0] && fieldsValue.timeDate[0].valueOf()) ||
          null;
        formFieldsValue.endDate =
          (fieldsValue.timeDate && fieldsValue.timeDate[1] && fieldsValue.timeDate[1].valueOf()) ||
          null;
      } else if (key === 'operTime') {
        formFieldsValue.operBeginDate =
          (fieldsValue.operTime && fieldsValue.operTime[0] && fieldsValue.operTime[0].valueOf()) ||
          null;
        formFieldsValue.operEndDate =
          (fieldsValue.operTime && fieldsValue.operTime[1] && fieldsValue.operTime[1].valueOf()) ||
          null;
      } else if (key === 'assArr') {
        formFieldsValue[key] = fieldsValue[key];
      } else {
        formFieldsValue[key] =
          fieldsValue[key] === undefined || fieldsValue[key] === null
            ? null
            : fieldsValue[key].trim();
        delete formFieldsValue.timeDate;
        delete formFieldsValue.operTime;
      }
    });
    console.log(formFieldsValue,'formFieldsValue');
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        formatFormFieldsValue: formFieldsValue,
      },
    });
    return formFieldsValue;
  };

  tabChange = value => {
    const { dispatch, location, form, formFieldsValue } = this.props;
    router.push({
      pathname: location.pathname,
      query: {
        activeKey: value,
      },
    });
    form.setFieldsValue({
      curMthDeclFlag: '1',
      declWay: '0',
    });
    // 切换tab时重置状态选项
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        activeKey: value,
        formFieldsValue: {
          ...formFieldsValue,
          curMthDeclFlag: +value === 1 ? '1' : undefined,
          declWay: +value === 2 ? '0' : undefined,
        },
      },
    });
    this.setState({
      selectedKeys: [],
      rowSelection: [],
    });
    this.searchList(
      this.processFormData({
        ...formFieldsValue,
        curMthDeclFlag: +value === 1 ? '1' : undefined,
        declWay: +value === 2 ? '0' : undefined,
      }),
      value
    );
  };

  curMthChange = value => {
    const { activeKey, formFieldsValue, dispatch } = this.props;
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        formFieldsValue: { ...formFieldsValue, curMthDeclFlag: value },
      },
    });
    this.searchList(this.processFormData({ ...formFieldsValue, curMthDeclFlag: value }), activeKey);
  };

  batchFeedback = () => {
    router.push('/socialinsurancemanagement/insrecruition/batchFeedback?busiType=14');
  };

  changeArea = value => {
    const { dispatch } = this.props;
    this.setState({ fetching: true });
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        result: [],
      },
    });
    dispatch({
      type: 'addempsocial/changeArea',
      payload: { areaName: value },
    });
  };

  cancleApply = () => {
    const { selectedKeys, rowSelection } = this.state;
    if (!this.rowValidate()) {
      return;
    }
    if (cusSome(rowSelection, 'probFlag', 1)) {
      message.error('问题人员无法做相关操作');
    } else {
      confirm({
        title: (
          <div>
            是否对当前列表<span className="emphasize-text">{selectedKeys.length}</span>
            条数据进行取消申报？
          </div>
        ),
        onOk: () => {
          this.confirmInter();
        },
        okText: '是',
        cancelText: '否',
        onCancel() {},
      });
    }
  };

  goDetail = record => {
    const detailId = record.addDetId;
    router.push(`/socialinsurancemanagement/insrecruition/detail?addDetId=${detailId}`);
  };

  // 查询表格布局
  toggleForm = () => {
    const { expandForm, dispatch } = this.props;
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        expandForm: !expandForm,
      },
    });
  };

  // 网上申报错误下载
  showOnlinDownDeclErr = (count, list) => {
    const cannotDecList = list.map(item => ({
      serialNum: item.serialNum,
      certNo: item.certNo,
      empName: item.addDetName,
      custSerRespId: item.custSerRespId,
      creId: item.creId,
      cause: item.cause,
    }));
    const obj = {
      cannotDecList,
    };
    Modal.warning({
      content: (
        <Row>
          <Row>
            当前存在<span className="emphasize-text">{count}条</span>数据不可申报，请下载查看。
          </Row>
          <a onClick={() => this.download('/osApi/insAddDet/declErrDataTemplate', obj)}>下载</a>
        </Row>
      ),
      okText: '关闭',
      okType: 'default',
      autoFocusButton: 'cancel',
    });
  };

  // 获取大库列表
  onSearch = value => {
    const { dispatch } = this.props;
    if (value.trim().length) {
      dispatch({
        type: 'bigaccomanage/fetchInsSearchList',
        payload: { accoName: value.trim() },
      });
    }
  };

  // 线下申报错误下载
  showUnderDownDeclErr = (count, batNo) => {
    Modal.warning({
      title: (
        <Row>
          <Row>
            当前存在<span className="emphasize-text">{count}条</span>数据不可申报，请下载查看。
          </Row>
          <a
            onClick={() =>
              this.download('/osApi/insAddDet/syncInsAddUnderLineDeclErrMessage', { batNo })
            }
          >
            下载
          </a>
        </Row>
      ),
      okText: '关闭',
      okType: 'default',
      autoFocusButton: 'cancel',
    });
  };

  onExecState = value => {
    const {
      activeKey,
      pageData: { pagination },
      formFieldsValue,
      dispatch,
    } = this.props;
    dispatch({
      type: 'addempsocial/updateModalData',
      payload: {
        formFieldsValue: { ...formFieldsValue, declWay: value },
      },
    });
    this.searchList(
      this.processFormData({ ...formFieldsValue, declWay: value }),
      activeKey,
      pagination.current,
      pagination.pageSize
    );
  };

  render() {
    const {
      pageData,
      loading,
      activeKey,
      expandForm,
      formFieldsValue,
      listLoading,
      defaultLibrary,
      tag,
      proFormFieldsValue,
      addempsocial: {
        execStepList,
        matStateList,
        curMthDeclFlagList,
        payWayList,
        pdAttrList,
        pdOptionList,
        result,
        declData,
        progressPercent,
        isConfig,
        showProgress,
      },
      addsocialbatch,
    } = this.props;
    const {
      fetching,
      visible2,
      proVisible,
      visible5,
      signValue,
      remarkVisible,
      textR,
      selectedKeys,
      decExcelVisible,
      declInParam,
      tableLoading,
      selectedRows,
      mode,
      accoOwnerFlag,
    } = this.state;
    const { form ,
      bigwareList,
    } = this.props;
    const { getFieldDecorator } = form;
    const columns = [
      {
        title: '姓名',
        dataIndex: 'empName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', minWidth: 80, maxWidth: 120 } }),
      },
      {
        title: '证件号',
        dataIndex: 'certNo',

        onCell: () => ({ style: { minWidth: 130, wordBreak: 'break-all', textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
      },
      {
        title: '执行地区',
        dataIndex: 'declAreaName',
        width: 95,
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
      },
      {
        title: '执行账户',
        dataIndex: 'insAccoName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: text => <TextOverFlow text={text} />,
      },
      {
        title: '业务开始日期',
        dataIndex: 'beginTime',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        render: text => moment(text).format('YYYY-MM-DD'),
      },
      {
        title: '所属客服',
        dataIndex: 'creName',
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: text => text || '--',
      },
      {
        title: '网报反馈',
        dataIndex: 'exexFdbk',
        className: Number(activeKey) === 4 ? styles.show : styles.hide,
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: text => (
          <Tooltip title={text}>
            <span
              style={{
                display: 'inline-block',
                width: 140,
                textOverflow: 'ellipsis',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
              }}
            >
              {text || '--'}
            </span>
          </Tooltip>
        ),
      },
      {
        title: '险种',
        dataIndex: 'ass',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: 60, textAlign: 'center' } }),
        render: (text, record) =>
          Number(record.insMergFlag) === 1 ? '社保' : matchDict(pdAttrList, text),
      },
      {
        title: '操作时间',
        dataIndex: 'operTime',
        className: styles.show,
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        render: text =>
          text ? (
            <span style={{ minWidth: 60 }}>{moment(text).format('YYYY-MM-DD HH:mm')}</span>
          ) : (
            '--'
          ),
      },
      {
        title: '操作',
        dataIndex: 'n11',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: 150, textAlign: 'center' } }),
        render: (text, record) => (
          <div>
            <span
              style={{ color: '#1890FF', cursor: 'pointer' }}
              onClick={() => this.goDetail(record)}
            >
              {' '}
              查看
            </span>
            {Number(activeKey) === 6 ? null : (
              <Fragment>
                <Divider type="vertical" />
                <a onClick={() => this.editMark(record)}>办理备注</a>
              </Fragment>
            )}
          </div>
        ),
      },
    ];

    const formItemLayout2 = {
      labelCol: { md: { span: 4 } },
      wrapperCol: { md: { span: 18 } },
    };
    const formItemLayoutState = {
      labelCol: { md: { span: 8 } },
      wrapperCol: { md: { span: 16 } },
    };

    // 选择功能配置 待申报

    const declareMenu = (
      <Menu>
        {checkPermissions('os:insAddDet:insAddImport') && (
          <Menu.Item>
            <span onClick={this.goProgress}>申报结果导入</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:completeDecl') && (
          <Menu.Item>
            <span onClick={this.signSuccess}>标记申报成功</span>
          </Menu.Item>
        )}
        {/* {checkPermissions('os:insAddDet:declFail') && (
          <Menu.Item>
            <span onClick={this.signFail}>标记申报失败</span>
          </Menu.Item>
        )} */}
      </Menu>
    );
    // 申报中更多（取消申报，材料下载，申报明细表导出）
    const ingMore = (
      <Menu>
        {checkPermissions('os:insAddDet:cancelDecl') && (
          <Menu.Item>
            <span onClick={this.cancleApply}>取消申报</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:downloadMatsZip') && (
          <Menu.Item>
            <span onClick={this.materialDownload}>材料下载</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:downloadDeclDetInsAddImport') && (
          <Menu.Item>
            <span onClick={this.declareExport}>申报明细表导出</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:batchUpdInsAddDet') && (
          <Menu.Item>
            <span onClick={this.batchModify}>批量修改</span>
          </Menu.Item>
        )}
        <Menu.Item>
          <span onClick={this.exportData}>导出</span>
        </Menu.Item>
      </Menu>
    );
    // 取消申报更多（标记问题人员，材料下载，申报明细表导出）
    const cancleMore = (
      <Menu>
        {checkPermissions('os:insAddDet:signProbFlag') && (
          <Menu.Item>
            <span onClick={this.signProblem}>标记问题人员</span>
          </Menu.Item>
        )}
        {/* {checkPermissions('os:insAddDet:downloadMatsZip') && (
          <Menu.Item>
            <span onClick={this.materialDownload}>材料下载</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:downloadDeclDetInsAddImport') && (
          <Menu.Item>
            <span onClick={this.declareExport}>申报明细表导出</span>
          </Menu.Item>
        )} */}
        {checkPermissions('os:insAddDet:batchUpdInsAddDet') && (
          <Menu.Item>
            <span onClick={this.batchModify}>批量修改</span>
          </Menu.Item>
        )}
      </Menu>
    );
    const delMore = (
      <Menu>
        {checkPermissions('os:insAddProb:addProb') && (
          <Menu.Item>
            <span onClick={this.signProblem}>标记问题人员</span>
          </Menu.Item>
        )}
        {checkPermissions('os:insAddDet:batchUpdInsAddDet') && (
          <Menu.Item>
            <span onClick={this.batchModify}>批量修改</span>
          </Menu.Item>
        )}
        <Menu.Item
          onClick={() => router.push(`/socialinsurancemanagement/insrecruition/batchDeclaration`)}
        >
          <span>批量标记申报中</span>
        </Menu.Item>
        <Menu.Item onClick={this.exportData}>
          <span>导出</span>
        </Menu.Item>
      </Menu>
    );
    const children = result.map(email => <Option key={email.areaId}>{email.areaName}</Option>);
    const tabArr1 = (
      <div>
        <div style={{ display: 'flex', justifyContent: 'space-between' }}>
          <div>
            <Authorized authority="os:insAddDet:onLineDecl" noMatch={null}>
              <Button type="primary" onClick={this.onDeclare} style={{ marginRight: 8 }}>
                网上申报
              </Button>
            </Authorized>
            <Authorized authority="os:insAddDet:underLineDecl" noMatch={null}>
              <Button style={{ marginRight: 8 }} onClick={this.offDeclare}>
                线下申报
              </Button>
            </Authorized>
            <Dropdown overlay={delMore}>
              <Button>
                更多 <DownOutlined />
              </Button>
            </Dropdown>
          </div>

          <div style={{ width: 201 }} className={styles.tabSelect}>
            <FormItem {...formItemLayoutState} label="状态">
              {getFieldDecorator('curMthDeclFlag', {
                initialValue: formFieldsValue.curMthDeclFlag || '1',
              })(
                <Select style={{ width: 130 }} onChange={this.curMthChange}>
                  {curMthDeclFlagList.map(value => (
                    <Option value={value.itemCode} key={value.itemCode}>
                      {value.itemName}
                    </Option>
                  ))}
                </Select>
              )}
            </FormItem>
          </div>
        </div>
        {defaultLibrary ? (
          <Alert
            message="业务范围维护的地区增加了政策组，请先维护该地区的政策组默认大库后再申报。"
            type="warning"
            showIcon
          />
        ) : null}
      </div>
    );
    const tabArr2 = (
      <div>
        <div style={{ display: 'flex', justifyContent: 'space-between' }}>
          <div>
            <Row>
              <Dropdown overlay={declareMenu}>
                <Button type="primary" style={{ marginRight: 8 }}>
                  申报完成
                </Button>
              </Dropdown>
              <Authorized authority="os:insAddProb:addProb" noMatch={null}>
                <Button style={{ marginRight: 8 }} onClick={this.signProblem}>
                  标记问题人员
                </Button>
              </Authorized>

              <Dropdown overlay={ingMore}>
                <Button>
                  更多 <DownOutlined />
                </Button>
              </Dropdown>
            </Row>
          </div>
          <div className={styles.tabSelect}>
            <Form>
              <FormItem {...formItemLayoutState} label="申报状态">
                {getFieldDecorator('declWay', {
                  rules: [{ required: false }],
                  initialValue: formFieldsValue.declWay || '0',
                })(
                  <Select style={{ width: 136 }} onChange={this.onExecState}>
                    <Option value="0">全部</Option>
                    <Option value="1">网上申报</Option>
                    <Option value="2">线下申报</Option>
                  </Select>
                )}
              </FormItem>
            </Form>
          </div>
        </div>
      </div>
    );

    const tabArr3 = (
      <div>
        <Row style={{ marginBottom: 16 }}>
          <Authorized authority="os:insAddDet:cancelDeclButShow" noMatch={null}>
            <Button type="primary" onClick={this.cancleApply} style={{ marginRight: 8 }}>
              取消申报
            </Button>
          </Authorized>
          <Authorized authority="" noMatch={null}>
            <Button onClick={this.exportData}>导出</Button>
          </Authorized>
          {checkPermissions('os:insAddDet:downloadDeclDetInsAddImport') && (
          <Button onClick={this.declareExport} style={{marginLeft:8}}>
            申报明细表导出
          </Button>
        )}
        </Row>
      </div>
    );
    const tabArr4 = (
      <div>
        <Row style={{ marginBottom: 16 }}>
          <Authorized authority="os:insAddDet:onLineDecl" noMatch={null}>
            <Button type="primary" onClick={this.onDeclare} style={{ marginRight: 8 }}>
              网上申报
            </Button>
          </Authorized>
          <Authorized authority="os:insAddDet:underLineDecl" noMatch={null}>
            <Button style={{ marginRight: 8 }} onClick={this.offDeclare}>
              线下申报
            </Button>
          </Authorized>

          <Dropdown overlay={cancleMore}>
            <Button>
              更多 <DownOutlined />
            </Button>
          </Dropdown>
        </Row>
      </div>
    );
    const tabArr5 = (
      <div>
        <Row style={{ marginBottom: 16 }}>
          <Authorized authority="os:insAddProb:addProbFdbk" noMatch={null}>
            <Button type="primary" onClick={this.batchFeedback} style={{ marginRight: 8 }}>
              批量反馈
            </Button>
          </Authorized>
          <Authorized authority="os:insAddDet:exportInsAdd" noMatch={null}>
            <ProExportBtn selectedRowKeys={selectedKeys} downloadParams={proFormFieldsValue} />
            {/* <Button onClick={this.exportExcel} loading={excelLoading}>
              {!excelLoading && <Icon type="download" />}
              导出 */}
            {/* </Button> */}
          </Authorized>
        </Row>
      </div>
    );
    const tabArr6 = null;

    const tabArr = [tabArr1, tabArr2, tabArr3, tabArr4, tabArr5, tabArr6];
    const formItemLayout = {
      labelCol: { md: { span: 7 } },
      wrapperCol: { md: { span: 17 } },
    };

    const renderSimpleForm = (
      <Form layout="inline">
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="客户名称">
              {getFieldDecorator('custId', {
                initialValue: formFieldsValue.custId,
                rules: [{ required: false }],
              })(<Customer attr />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="执行地">
              {getFieldDecorator('declAreaId', {
                initialValue: formFieldsValue.declAreaId,
                rules: [{ required: false }],
              })(
                <Select
                  filterOption={false}
                  showSearch
                  onSearch={this.changeArea}
                  notFoundContent={fetching ? <Spin size="small" /> : '暂无数据'}
                  style={{ width: '100%' }}
                  placeholder="请输入"
                  allowClear
                  optionFilterProp="children"
                >
                  {children}
                </Select>
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <span className={styles.submitButtons}>
              <Button type="primary" onClick={() => this.searchBtnList(activeKey)}>
                查询
              </Button>
              <Button style={{ marginLeft: 8 }} onClick={() => this.reset()}>
                重置
              </Button>
              <a style={{ marginLeft: 8 }} onClick={this.toggleForm}>
                展开 <DownOutlined />
              </a>
            </span>
          </Col>
        </Row>
      </Form>
    );
    const renderAdvancedForm = (
      <Form layout="inline">
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="客户名称">
              {getFieldDecorator('custId', {
                initialValue: formFieldsValue.custId,
                rules: [{ required: false }],
              })(<Customer attr />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="执行地">
              {getFieldDecorator('declAreaId', {
                initialValue: formFieldsValue.declAreaId,
                rules: [{ required: false }],
              })(
                <Select
                  filterOption={false}
                  showSearch
                  onSearch={this.changeArea}
                  notFoundContent={fetching ? <Spin size="small" /> : '暂无数据'}
                  style={{ width: '100%' }}
                  placeholder="请输入"
                  allowClear
                  optionFilterProp="children"
                >
                  {children}
                </Select>
              )}
            </FormItem>
          </Col>
          {/* <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="所属客服">
              {getFieldDecorator('custSerRespName', {
                initialValue: formFieldsValue.custSerRespName,
                rules: [{ required: false }],
              })(<Input placeholder="请输入" />)}
            </FormItem>
          </Col> */}
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="所属客服">
              {getFieldDecorator('creId', {
                initialValue: formFieldsValue.creId,
              })(
                <SearchPersonEs
                  allowClear
                  showSearch
                  filterOption={(input, option) =>
                    option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
                  }
                />
              )}
            </FormItem>
          </Col>
        </Row>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="业务开始日期">
              {getFieldDecorator('timeDate', {
                initialValue: formFieldsValue.timeDate,
                rules: [{ required: false }],
              })(
                <RangePicker
                  placeholder={['开始日期', '结束日期']}
                  onChange={this.dateChange}
                  format="YYYY-MM-01"
                  mode={mode}
                  onPanelChange={this.dateChange}
                  style={{ width: '100%' }}
                />
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="姓名">
              {getFieldDecorator('empName', {
                initialValue: formFieldsValue.empName,
                rules: [{ required: false }],
              })(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="证件号">
              {getFieldDecorator('certNo', {
                initialValue: formFieldsValue.certNo,
                rules: [{ required: false }],
              })(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
        </Row>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="材料提交状态">
              {getFieldDecorator('matState', {
                initialValue: formFieldsValue.matState,
                rules: [{ required: false }],
              })(
                <Select placeholder="请选择" allowClear optionFilterProp="children" showSearch>
                  {matStateList.map(value => (
                    <Option value={value.itemCode} key={value.itemCode}>
                      {value.itemName}
                    </Option>
                  ))}
                </Select>
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="险种">
              {getFieldDecorator('assArr', {
                initialValue: formFieldsValue.assArr,
                rules: [{ required: false }],
              })(
                <Select
                  showSearch
                  placeholder="请选择"
                  allowClear
                  optionFilterProp="children"
                  mode="multiple"
                >
                  {pdOptionList.map(value => (
                    <Option value={value.itemCode} key={value.itemCode}>
                      {value.itemName}
                    </Option>
                  ))}
                </Select>
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="缴费方式">
              {getFieldDecorator('payWay', {
                initialValue: formFieldsValue.payWay,
                rules: [{ required: false }],
              })(
                <Select showSearch placeholder="请选择" allowClear optionFilterProp="children">
                  {payWayList.map(value => (
                    <Option value={value.itemCode} key={value.itemCode}>
                      {value.itemName}
                    </Option>
                  ))}
                </Select>
              )}
            </FormItem>
          </Col>
        </Row>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            {/* <FormItem {...formItemLayout} label="执行账户">
              {getFieldDecorator('insAccoName', {
                initialValue: formFieldsValue.insAccoName,
                rules: [{ required: false }],
              })(<Input placeholder="请输入" />)}
            </FormItem> */}
            {/* <FormItem {...this.formItemLayout} label="执行账户"> */}
            <FormItem label="执行账户" {...formItemLayout}>
              {getFieldDecorator('insAccoId', {
                initialValue: formFieldsValue.insAccoId,
              })(
                <BigwareList
                  placeholder="请输入"
                  onSearch={this.onSearch}
                  bigwareList={bigwareList}
                  loading={listLoading}
                />
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem label="操作时间" {...formItemLayout}>
              {getFieldDecorator('operTime', {
                initialValue: formFieldsValue.operTime,
              })(<RangePicker style={{ width: '100%' }} />)}
            </FormItem>
          </Col>
          {accoOwnerFlag && (
            <Col md={8} sm={24}>
              <FormItem label="账户负责人" {...formItemLayout}>
                {getFieldDecorator('accoRespId', {
                  initialValue: formFieldsValue.accoRespId,
                })(
                  <SearchAccoListOs
                    allowClear
                    showSearch
                    filterOption={(input, option) =>
                      option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
                    }
                  />
                )}
              </FormItem>
            </Col>
          )}
          <Col md={8} sm={24} offset={!accoOwnerFlag ? 0 : 16}>
            <div style={{ overflow: 'hidden' }}>
              <div style={{ float: 'right', marginBottom: 24 }}>
                <Button type="primary" onClick={() => this.searchBtnList(activeKey)}>
                  查询
                </Button>
                <Button style={{ marginLeft: 8 }} onClick={this.reset}>
                  重置
                </Button>
                <a style={{ marginLeft: 8 }} onClick={this.toggleForm}>
                  收起 <UpOutlined />
                </a>
              </div>
            </div>
          </Col>
        </Row>
      </Form>
    );
    const renderForm = expandForm ? renderAdvancedForm : renderSimpleForm;
    if (!isConfig) {
      return (
        <div
          style={{
            display: 'flex',
            justifyContent: 'center',
            alignItems: 'center',
            height: '100%',
          }}
        >
          <Spin size="large" />
        </div>
      );
    }
    return (
      <PageHeaderWrapper>
        <Card className={styles.searchCard}>
          <div className={styles.tableListForm}>{renderForm}</div>
        </Card>
        <Card className={styles.tabCard}>
          <div className={styles.tableList}>
            <Tabs activeKey={activeKey} onChange={this.tabChange}>
              {execStepList.map((value, index) => (
                <TabPane tab={value.itemName} key={value.itemCode}>
                  {tabArr[index]}
                  {/* {index} */}
                  {index !== 3 ? (
                    <StandardTable
                      selectedRows={selectedRows}
                      loading={loading}
                      selectedRowKeys={selectedKeys}
                      data={pageData}
                      columns={columns}
                      rowKey="addDetId"
                      onSelectRow={this.handleSelectRows}
                      onChange={this.handleStandardTableChange}
                    />
                  ) : (
                    <ProTable
                      onRef={e => {
                        this.setState({ proTable: e });
                      }}
                      selectedRows={selectedRows}
                      selectedRowKeys={selectedKeys}
                      onSelectRow={this.handleSelectRows}
                      proUrl="/socialinsurancemanagement/insrecruition/problem"
                      busiType="14"
                    />
                  )}
                </TabPane>
              ))}
            </Tabs>
          </div>
        </Card>
        {/* 结果导入  */}
        <div>
          <Modal
            title="申报结果导入"
            visible={visible2}
            onOk={this.handleOk2}
            onCancel={this.handleCancel2}
          >
            <div style={{ textAlign: 'center' }}>
              <Button type="primary">模板下载</Button>
              <Button type="primary" style={{ marginLeft: 30 }}>
                导入
              </Button>
            </div>
          </Modal>
        </div>
        {/* 标记问题 人员弹窗 */}
        {proVisible && (
          <ProModal
            selectedRows={selectedRows}
            selectedRowKeys={selectedKeys}
            busiType="14"
            onOk={this.proHandleOk}
            onCancel={this.handleCancel3}
            isProType
            isAlertObj
          />
        )}
        <Modal
          title="标记申报成功"
          visible={visible5}
          onOk={this.handleOk5}
          onCancel={this.handleCancel5}
        >
          <div>
            <Row>
              <Col>
                <FormItem {...formItemLayout2} label="执行结果">
                  <Select
                    defaultValue={signValue}
                    style={{ width: 120 }}
                    onChange={this.handleChange}
                  >
                    <Option value="1">申报成功</Option>
                  </Select>
                </FormItem>
              </Col>
            </Row>
          </div>
        </Modal>
        <Modal
          title="办理备注"
          visible={remarkVisible}
          onOk={this.remarkOk}
          onCancel={this.remarkCancel}
        >
          <Form style={{ lineHeight: '40px' }}>
            <FormItem>
              <Row>
                <Col span={6}>运行备注详情 :</Col>
              </Row>
              <Row>
                <Col span={20}>
                  <Row>
                    <TextArea
                      placeholder="请输入..."
                      value={textR}
                      onChange={this.textChangeR}
                      autoSize={{ minRows: 3, maxRows: 6 }}
                    />
                  </Row>
                </Col>
              </Row>
            </FormItem>
          </Form>
        </Modal>
        <DeclareModal
          visible={decExcelVisible}
          inParam={declInParam}
          dataSource={declData}
          tableLoading={tableLoading}
          downSingleClick={this.downSingleClick}
          onCancel={this.onDeclareCancel}
          pageChange={this.pageChange}
          pageSizeChange={this.pageSizeChange}
          onOk={this.onDeclareOk}
          declExportId="insDeclExportId"
          accoName="insAccoName"
          downLoadDeclErr={this.download}
        />
        <Modal
          title={tag === 'online' ? '网上申报' : '线下申报'}
          footer={null}
          closable={false}
          visible={showProgress}
        >
          <div style={{ textAlign: 'center' }}>
            <div>
              <Progress
                percent={progressPercent}
                format={percent => `${percent}%`}
                style={{ paddingRight: 24, marginBottom: 20 }}
              />
            </div>
          </div>
        </Modal>
        <BatchTaskProgress
          progressVisible={addsocialbatch.showProgress}
          progressPercent={addsocialbatch.progressPercent || 0}
          isShowResult={addsocialbatch.progressPercent === 100}
          resultInfo={addsocialbatch.resultInfo}
          handleProgressModalVisible={this.handleProgressModalVisible}
          maskClosable={false}
        />
      </PageHeaderWrapper>
    );
  }
}

export default BasicList;
